<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="../css/aui.css"/>
    <title>手机登录</title>
    <style>
        body {
            background: url("../image/login_bg.png") no-repeat;
            width: 100%;
            height: 50px;
            background-size: 100% 100%;
            text-align: center;
        }
        .aui-content {
            width: 85%;
            margin-top: 100px;
            margin-left: auto;
            margin-right: auto;
            margin-bottom: 0;
        }

        .aui-form {
            position: static;
            border-radius: 5px;
            margin-bottom: 10px;
        }

        .aui-input-row {
            position: static;
            width: 100%;
        }

        .aui-input-row .aui-input-addon {
            padding-left: 15px;
        }

        .vali {
            margin-top: 4px;
            float: right;
            background-color: #fff;
            border: none;
            border-left: 1px solid #ccc;
            border-radius: 0;
            padding-left: 15px;
            padding-right: 5px;
        }

        #password {
            width: 60%;
            padding-right: 0px;
        }

        .aui-btn-block{
           padding: 8px 0px; 
        }

        .aui-btn-row {
            padding: 20px 0 20px 0;
            position: static;
        }

        .login_name {
            color: #ffffff;
        }

        .aui-btn-info {
            color: #ffffff;
            background-color: #327AFA;
            border: 1px solid #327AFA;
        }

        .aui-btn-row {
            padding: 5px 0px;
        }

        .register {
            color: #fff;
            background-color: transparent;
        }
    </style>
</head>
<body>
<div class="aui-content">
    <div class="aui-form">
        <div class="aui-input-row" style="border-bottom: 1px solid #ccc;">
            <label class="aui-input-addon">账号</label>
            <input type="text" id="mobile" class="aui-input" placeholder="请输入手机号码">
        </div>
        <div class="aui-input-row">
            <label class="aui-input-addon">密码</label>
            <input type="password" id="password" class="aui-input" placeholder="6-20位数字或字母"/>

            <div class="aui-btn vali" tapmode onclick="forget()">忘记密码?</div>
        </div>
    </div>
    <div class="aui-btn-row">
        <div class="aui-btn aui-btn-info aui-btn-block" tapmode onclick="login()">
            登录
        </div>
    </div>
    <div class="aui-btn-row">
        <div class="aui-btn aui-btn-block register" tapmode onclick="register()">
            注册
        </div>
    </div>
</div>
<div class="login_name">
    <span tapmode onclick="loginMobile()">动态密码登录</span>
    <i class="aui-iconfont aui-icon-roundright"></i>
</div>
</div>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/myInfo.js"></script>
<script type="text/javascript" src="../script/jquery-1.11.3.js"></script>
<script type="text/javascript">
    apiready = function () {
        api.parseTapmode();
    }
    function login() {
        var mobile = $api.val($api.byId('mobile'));
        var password = $api.val($api.byId('password'));
        var data = {};
        if (mobile.length > 0 && password.length > 0) {
            data['mobile'] = mobile;
            data['password'] = password;
            var url = 'login/login';
            ajaxRequest(url, 'post', data, function (ret, err) {
                if (ret.status == 1) {
                $api.clearStorage();
                $api.setStorage('user_id',ret.msg.userid);
                    api.toast({
                        msg: '登录成功',
                        duration: 2000,
                        location: 'bottom'
                    });
                    setTimeout(function() {
								//关闭到指定窗口，最上面显示的窗口到指定name窗口间的所有窗口都会被关闭
								api.closeToWin({
									name : 'root',
									animation : {
										type : 'flip',
										subType : 'from_bottom',
										duration : 500
									}
								});
							}, 1000);
                } else {
                    api.toast({
                        msg: '登录失败',
                        duration: 2000,
                        location: 'bottom'
                    });
                }
            });
        } else {
            api.toast({
                msg: '请输入完整信息',
                duration: 2000,
                location: 'bottom'
            });
        }
    }

    function register(){
        api.openWin({
            name : 'register_win',
            url : 'register_win.html',
            reload : true,
            delay : 300
        });
    }

    function loginMobile(){
        api.openWin({
            name : 'loginMobile_win',
            url : 'loginMobile_win.html',
            reload : true,
            delay : 300
        });
    }

    function forget(){
        api.openWin({
            name : 'forget_win',
            url : 'forget_win.html',
            reload : true,
            delay : 300
        });
    }
</script>
</body>
</html>